import React from 'react'
import './index.css'

const FlexBoxFlex=()=>{
    return (
      <div>
        <h2>flex属性：</h2>
        <div className="flexBox">
          <span className="flexItem, {flex: 0}">1</span>
          <span className="flexItem, {flex: 1}">2</span>
          <span className="flexItem, {flex: 2}">3</span>
          <span className="flexItem, {flex: 3}">4</span>
        </div>

        <h2>父容器空间不足的时候</h2>
        <div className="flexBox, {width: 100}">
          <span className="flexItem, {flex: 1, width: 100}">1</span>
          <span className="flexItem, {flex: 2, width: 200}">2</span>
        </div>
      </div>
    );
  };

  export default FlexBoxFlex